<template>
  <div>
    <el-card  class="operator-button-card">
      <template #header>
        <div class="flex justify-between items-center">
          <h2 class="operator-button-label">{{ $t('operator.downloadConfig') }}</h2>
          <div>
            <el-button
              v-if="isAuth('10400202.MANAGE')"
              type="primary"
              size="small"
              :loading="btnLoading"
              @click="ClickHandle"
              >{{ $t('common.save') }}</el-button
            >
          </div>
        </div></template
      >

      <el-form
        ref="downloadConfigForm"
        class="center"
        :model="downloadConfigForm"
        size="small"
        label-width="250px"
      >
        <el-form-item :label="$t('operator.toms') + ':'">
          <el-select
            v-model="downloadConfigForm.tomsDownloadTransferPath"
            clearable
            style="width: 400px"
          >
            <el-option
              v-for="item in tomsDownloadTransferPathList"
              :key="item"
              :value="item"
              :label="item"
            />
          </el-select>
        </el-form-item>
        <el-form-item :label="$t('operator.appStoreDownload') + ':'">
          <el-select
            v-model="downloadConfigForm.appStoreDownloadTransferPath"
            clearable
            style="width: 400px"
          >
            <el-option
              v-for="item in appStoreDownloadTransferPathList"
              :key="item"
              :value="item"
              :label="item"
            />
          </el-select>
        </el-form-item>
        <el-form-item :label="$t('operator.appStoreResource') + ':'">
          <el-select
            v-model="downloadConfigForm.appStoreResourceTransferPath"
            clearable
            style="width: 400px"
          >
            <el-option
              v-for="item in appStoreResourceTransferPathList"
              :key="item"
              :value="item"
              :label="item"
            />
          </el-select>
        </el-form-item>
        <el-form-item :label="$t('operator.paramPlatform')">
          <el-select
            v-model="downloadConfigForm.paramPlatformDownloadTransferPath"
            clearable
            style="width: 400px"
          >
            <el-option
              v-for="item in paramPlatformDownloadTransferPathList"
              :key="item"
              :value="item"
              :label="item"
            />
          </el-select>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
import {
  getDownloadTransferPathList,
  getOperatorDownloadTransferPath,
  addOrUpdateOperatorDownloadTransferPath
} from '@/api/operator'
import { isAuth } from '@/utils'

export default {
  props: {
    operator: Object
  },
  data() {
    return {
      btnLoading: false,
      downloadConfigForm: {
        tomsDownloadTransferPath: '',
        appStoreDownloadTransferPath: '',
        appStoreResourceTransferPath: '',
        paramPlatformDownloadTransferPath: ''
      },
      tomsDownloadTransferPathList: [],
      appStoreDownloadTransferPathList: [],
      paramPlatformDownloadTransferPathList: [],
      appStoreResourceTransferPathList: []
    }
  },
  created() {
    this.getDownloadTransferPathList()
    this.getOperatorDownloadTransferPath()
  },
  methods: {
    ClickHandle() {
      this.$confirm(this.$t('operator.save_cfg'), this.$t('page.tip'), {
        confirmButtonText: this.$t('page.confirm'),
        cancelButtonText: this.$t('page.cancel'),
        type: 'warning'
      }).then(() => {
        this.btnLoading = true
        const params = {
          operatorId: this.operator.operatorId,
          oid: this.operator.oid,
          tomsDownloadTransferPath:
            this.downloadConfigForm.tomsDownloadTransferPath,
          appStoreDownloadTransferPath:
            this.downloadConfigForm.appStoreDownloadTransferPath,
          appStoreResourceTransferPath:
            this.downloadConfigForm.appStoreResourceTransferPath,
          paramPlatDownloadTransferPath:
            this.downloadConfigForm.paramPlatformDownloadTransferPath
        }
        addOrUpdateOperatorDownloadTransferPath(params)
          .then((res) => {
            this.btnLoading = false
            this.$message({
              type: 'success',
              message: this.$t('common.success')
            })
          })
          .catch((e) => {
            this.btnLoading = false
            this.$confirmError(e)
          })
      })
    },
    getDownloadTransferPathList() {
      getDownloadTransferPathList()
        .then((res) => {
          this.tomsDownloadTransferPathList = res.tomsDownloadTransferPath
          this.appStoreDownloadTransferPathList =
            res.appStoreDownloadTransferPath
          this.paramPlatformDownloadTransferPathList =
            res.paramPlatformDownloadTransferPath
          this.appStoreResourceTransferPathList =
            res.appStoreResourceTransferPath
        })
        .catch((err) => {
          this.$confirmError(err)
        })
    },
    getOperatorDownloadTransferPath() {
      getOperatorDownloadTransferPath(this.operator.operatorId)
        .then((res) => {
          this.downloadConfigForm.tomsDownloadTransferPath =
            res.tomsDownloadTransferPath
          this.downloadConfigForm.appStoreDownloadTransferPath =
            res.appStoreDownloadTransferPath
          this.downloadConfigForm.appStoreResourceTransferPath =
            res.appStoreResourceTransferPath
          this.downloadConfigForm.paramPlatformDownloadTransferPath =
            res.paramPlatDownloadTransferPath || ''
          // console.log(res)
        })
        .catch((err) => {
          this.$confirmError(err)
        })
    },
    isAuth
  }
}
</script>

<style lang="scss" scoped>
.l-card {
  margin: 20px 36px;
}
</style>
